<template>
  <div class="parcel-wrapper">
    <div class="box">
      <div class="header-top">
        <header-form
          :search-column="defaultListQuery"
          @search="handleSearch"
          @reset="handleSearch"
        >
          <template v-slot:left>
            <el-button type="primary" size="mini">新增</el-button>
          </template>
        </header-form>
      </div>
      <ele-table
        :data="list"
        :column-list="defaultColumn"
        :total="pages.total"
        :pages="pages"
        @pagination="handlePagination"
      />
    </div>
  </div>
</template>

<script>
import EleTable from '@/components/Table/index.vue'
import HeaderForm from '@/components/HeaderForm.vue'

const defaultListQuery = [
  { label: '品牌名称', key: 'c' },
  { label: '状态', key: 'f' },
  { label: '品牌英文', key: 'd' },
  { label: '制作地', key: 'e' },
  { label: '状态', key: 'l' },
  { label: '创建时间', key: 'g' }
]

const defaultColumn = [
  { label: '序号', key: 'a' },
  { label: '品牌logo', key: 'b' },
  { label: '品牌名称', key: 'c' },
  { label: '品牌英文', key: 'd' },
  { label: '制作地', key: 'e' },
  { label: '状态', key: 'f' },
  { label: '创建时间', key: 'g' }
]
export default {
  name: 'BrandManagement',
  components: { HeaderForm, EleTable },
  props: {},
  data() {
    return {
      list: [{
        a: '测试',
        b: '测试',
        c: '测试',
        d: '测试',
        e: '测试',
        f: '测试',
        g: '测试'
      }],
      defaultListQuery,
      defaultColumn,
      pages: {
        total: 400,
        pageNum: 1,
        pageSize: 10
      }
    }
  },
  created() {},
  mounted() {},
  methods: {
    // 搜索
    handleSearch(data) {
      const searchData = Object.assign(data, this.pages)
      console.log(searchData)
    },
    // 分页
    handlePagination(data) {
      console.log(data)
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
